/**index.wxss**/

//page {
//  background: #f6f6f6;
//  display: flex;
//  flex-direction: column;
//  justify-content: flex-start;
//}
//
//.userinfo, .uploader, .tunnel {
//  margin-top: 40rpx;
//  height: 140rpx;
//  width: 100%;
//  background: #fff;
//  border: 1px solid rgba(0, 0, 0, 0.1);
//  border-left: none;
//  border-right: none;
//  display: flex;
//  flex-direction: row;
//  align-items: center;
//  transition: all 300ms ease;
//}
//
//.userinfo-avatar {
//  width: 100rpx;
//  height: 100rpx;
//  margin: 20rpx;
//  border-radius: 50%;
//  background-size: cover;
//  background-color: white;
//}
//
//.userinfo-avatar:after {
//  border: none;
//}
//
//.userinfo-nickname {
//  font-size: 32rpx;
//  color: #007aff;
//  background-color: white;
//  background-size: cover;
//}
//
//.userinfo-nickname::after {
//  border: none;
//}
//
//.uploader, .tunnel {
//  height: auto;
//  padding: 0 0 0 40rpx;
//  flex-direction: column;
//  align-items: flex-start;
//  box-sizing: border-box;
//}
//
//.uploader-text, .tunnel-text {
//  width: 100%;
//  line-height: 52px;
//  font-size: 34rpx;
//  color: #007aff;
//}
//
//.uploader-container {
//  width: 100%;
//  height: 400rpx;
//  padding: 20rpx 20rpx 20rpx 0;
//  display: flex;
//  align-content: center;
//  justify-content: center;
//  box-sizing: border-box;
//  border-top: 1px solid rgba(0, 0, 0, 0.1);
//}
//
//.uploader-image {
//  width: 100%;
//  height: 360rpx;
//}
//
//.tunnel {
//  padding: 0 0 0 40rpx;
//}
//
//.tunnel-text {
//  position: relative;
//  color: #222;
//  display: flex;
//  flex-direction: row;
//  align-content: center;
//  justify-content: space-between;
//  box-sizing: border-box;
//  border-top: 1px solid rgba(0, 0, 0, 0.1);
//}
//
//.tunnel-text:first-child {
//  border-top: none;
//}
//
//.tunnel-switch {
//  position: absolute;
//  right: 20rpx;
//  top: -2rpx;
//}
//
//.disable {
//  color: #888;
//}
//
//.service {
//  position: fixed;
//  right: 40rpx;
//  bottom: 40rpx;
//  width: 140rpx;
//  height: 140rpx;
//  border-radius: 50%;
//  background: linear-gradient(#007aff, #0063ce);
//  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
//  display: flex;
//  align-content: center;
//  justify-content: center;
//  transition: all 300ms ease;
//}

//.service-button {
//  position: absolute;
//  top: 40rpx;
//}
//
//.service:active {
//  box-shadow: none;
//}
//
//.request-text {
//  padding: 20rpx 0;
//  font-size: 24rpx;
//  line-height: 36rpx;
//  word-break: break-all;
//}
.index-wrap{
  padding: 28rpx 35rpx;
  .title{
    text{
      font-size: 36rpx;
      margin-left: 8rpx;
    }
  }
  .live-list-link{
    margin-top: 44rpx;
    margin-bottom: 34rpx;
    position: relative;
    height: 40rpx;
    &:before{
      content: '';
      width: 100%;
      height: 1rpx;
      position: absolute;
      background: #EEEEEE;
      left: 0;
      top: 20rpx;
    }
    .living-link{
      position: absolute;
      width: 180rpx;
      line-height: 40rpx;
      left: 250rpx;
      top: 0;
      text-align: center;
      background: #ffffff;
      font-size: 22rpx;
      color:rgba(21, 21, 21, 0.5);
      z-index: 2;
    }
    &.reach-bottom{
      margin-bottom: 0;
      .living-link{
        width: 276rpx;
        left: 202rpx;
      }
    }
  }
  .public-class-list{
    border-bottom: 2rpx solid #EEEEEE;
    padding-bottom: 40rpx;
    margin-bottom: 30rpx;
  }
  .card-list{
    .card{
      border-radius: 10rpx;
      box-shadow: 0 10rpx 10rpx rgba(221, 221, 221, 0.5);
      margin-top: 30rpx;
      .card-img{
        height: 250rpx;
        overflow: hidden;
        image{
          width: 100%;
        }
      }
      .card-info{
        width: 100%;
        padding: 20rpx 32rpx;
        height: 130rpx;
        box-sizing: border-box;
        display: flex;
        justify-content: space-between;
        .info{
          .time{
            font-size: 32rpx;
            line-height: 45rpx;
          }
          .nums{
            font-size: 26rpx;
            color: #151515;
            line-height: 37rpx;
            margin-top: 8rpx;
            color: rgba(21, 21, 21, 0.5);
          }
        }
        .btn-link{
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items:center;
          .living{
            width: 140rpx;
            height: 44rpx;
            line-height: 44rpx;
            background: #FFCC00;
            font-size: 26rpx;
            text-align: center;
            border-radius: 10rpx;
          }
          .origin-price{
            font-size: 22rpx;
            margin-top: 13rpx;
            text-decoration: line-through;
            color: rgba(21, 21, 21, 0.5);
          }
        }

      }
    }
  }
}
